<template>
	<view class="content">
		<view class="components-article">
			<!-- 搜索框 -->
			<view class="components-search">
				<u-search placeholder="日照香炉生紫烟" :clearabled="true" :focus="true" v-model="value" @custom="search"
					@search="search"></u-search>
			</view>
			<view class="">
				<view class="cu-card article" v-for="(item, index) in dataList" :key="index" @click="goToArticleDetail(item.id)">
					<view class="cu-item shadow">
						<view class="title">
							<view class="text-cut">{{item.title}}</view>
						</view>
						<view class="content">
							<image :src="item.imgUrl" mode="aspectFill"></image>
							<view class="desc">
								<view class="text-title">作者：{{item.creatorName}}</view>
								<view class="text-title">发表时间：{{item.createDate}}</view>
								<view class="text-title">搜索关键字：{{item.searchKeywords}}</view>
								<view>
								<view class="cu-tag bg-red light sm round">{{item.articlesTypeName}}</view>
							</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getArticleByKeyWord,
		getArticleByTypeId
	} from '@/api/article/articleList.js'
	export default {
		data() {
			return {
				value: '',
				dataList: []
			}
		},
		onLoad(option) {
			if (option.articlesTypeId !== '' || option.articlesTypeId !== null) {
				this.getArticleByTypeId(option.articlesTypeId)
			}
		},
		methods: {
			search(value) {
				console.log(value)
				getArticleByKeyWord(value).then(res => {
					console.log(res.data)
					this.dataList = res.data
				})
			},
			getArticleByTypeId (articlesTypeId) {
				getArticleByTypeId(articlesTypeId).then(res => {
					console.log(res.data)
					this.dataList = res.data
				})
			},
			goToArticleDetail(id) {
				uni.navigateTo({
					url: '/pages/article/article-detail?id=' + id
				});
			}
		}
	}
</script>

<style>

</style>